import SongSheetItem from '@/components/song-sheet-item/index';
import { getDjHotInfo } from '@/store/modules/hallSlice';
import React, { memo, useEffect } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import AudioStationWarrper from './style';

const index = memo(() => {
  const dispatch = useDispatch();
  useEffect(()=>{
    if(djRadios.length<=0)dispatch(getDjHotInfo());
  },[])
  const djRadios = useSelector((state)=>{
    return state.hall.djhot
  })
  return (
    <AudioStationWarrper>
      {
        djRadios?.map((n,i)=>{
          return (
            <SongSheetItem n={n} i={i} key={i}/>
          )
        })
      }
    </AudioStationWarrper>
  )
})

export default index